import React, {useState, useRef} from 'react';
import { history } from 'umi'
import { List,Icon } from 'antd-mobile'
import { ListView} from '@/components'
import { getExamRecordDetail,getAnswerRecordDetail } from '@/services/edu'
import style from './index.less'


const ListItem = (props,i) => {
  return (
    
  
  <List.Item className={style.listItem} thumb={props.doRight?<div>正确</div>:<div className={style.error}>错误</div>} arrow="horizontal" multipleLine onClick={() => {history.push(`/history/analysis?id=${props.recordId}&itemOrder=${props.itemOrder}`)}}>
  {props.shortTitle} 
</List.Item>
  );
};
function History() {
  const { query = {} } = history.location as any;
  const { id } = query;
  const params = useRef<any>({ rflag: 0 });
  const listViewRef = useRef<any>();

  const getData = async (pageNum, pageSize) => {
    
    const payload = {
      pageIndex:pageNum, pageSize,
      recordId:id
      // ...this.searchParams,
    };
    
    const res = await getAnswerRecordDetail(payload);
    const {
      list=[]
    }= res.response
    
    if(list.length){
      return list.map((item,i)=>{
        return {
          ...item,
          recordId:id,
          itemOrder:i,
          content:item.userCorrect,
        }
      })
    }
    
  };
  const row = (item) => {
    return <ListItem {...item} key={item.id} />;
  };
  return (
    <div>
      <div className={style.listWrpper}>
        <ListView ref={listViewRef} getData={getData} renderRow={row} />
      </div>
    </div>
  );
}

export default History;
